<template>
  <div>
    <div style="display: flex;justify-content: space-between;margin-top: 13px">
      <solar-cloud :status="device.status" :signal="device.netSignal" style="width: 150px" />
      <div style="margin: 5px">
        <div class="info-item">
          <span class="title">DTU{{ $t('hardware')+$t('version') }}:</span>
          <span class="value">{{ device.hardVersion }}</span>
        </div>
        <div class="info-item">
          <span class="title">DTU{{ $t('software')+$t('version') }}:</span>
          <span class="value">{{ device.softVersion }}</span>
        </div>
      </div>
    </div>
    <el-button type="primary" @click="calcutionDialogVisible=true">计算</el-button>
    <div>
      <div
        v-for="(item,index) in batteryList"
        :key="index"
        style="display: flex;margin-top: 20px;justify-content: center"
      >
        <solar-panel
          :device-core="device.deviceCore"
          :panel-power="panelPower"
          :mppt-version="item.mpptVersion"
          :pcb-template="item.pcbTemplate"
          :battery-charging="item.batteryCharging"
          :panel-power-count="item.panelPowerCount"
          :panel-day-power-count="item.panelDayPowerCount"
          :charging-voltage="item.chargingVoltage"
          :soft-version="item.softVersion"
        />
        <solar-battery
          style="margin-left: 30px"
          :device-core="device.deviceCore"
          :battery-capacity="batteryCapacity"
          :battery-surplus="item.batterySurplus"
          :battery-charging="item.batteryCharging"
          :battery-template="item.batteryTemplate"
          :battery-type="item.batteryType"
          :high-protect-template="item.highProtectTemplate"
          :low-protect-template="item.lowProtectTemplate"
          :charging-current="item.chargingCurrent"
          :charging-voltage="item.chargingVoltage"
          :battery-voltage="item.batteryVoltage"
          :output-current="item.outputCurrent"
        />
      </div>
      <power-count :device="device" style="width: 100%;height: 320px;margin-top: 13px" />
      <div style="margin: 20px 13px 13px 13px">
        <el-row :gutter="10">
          <el-col :xs="12" :sm="12" :md="12" :lg="8" :xl="8">
            <div class="info-item">
              <span class="title">{{ $t('last')+$t('OFFLINE')+$t('time') }}:</span>
              <span class="value">{{ formatDate(device.lastOffLineTimer) }}</span>
            </div>
          </el-col>
          <el-col :xs="12" :sm="12" :md="12" :lg="8" :xl="8">
            <div class="info-item">
              <span class="title">{{ $t('last')+$t('ONLINE')+$t('time') }}:</span>
              <span class="value">{{ formatDate(device.lastOnLineTimer) }}</span>
            </div>
          </el-col>
          <el-col :xs="12" :sm="12" :md="12" :lg="8" :xl="8">
            <div class="info-item">
              <span class="title">{{ $t('cardNumber') }}:</span>
              <span class="value">{{ device.phoneNumber }}</span>
            </div>
          </el-col>
          <el-col
            v-for="(item,index) in otherList"
            :key="index"
            :xs="12"
            :sm="12"
            :md="12"
            :lg="8"
            :xl="8"
            class="info-item"
          >
            <span class="title">{{ item.name }}:</span>
            <span class="value">{{ item.value }} {{ item.unit }}</span>
          </el-col>
        </el-row>
      </div>
    </div>

    <el-dialog
      top="15px"
      :visible.sync="calcutionDialogVisible"
      width="1000px"
    >
      <calculation />
    </el-dialog>

  </div>
</template>

<script>
import SolarBattery from './SolarBattery'
import Calculation from './Calculation'
import SolarPanel from './SolarPanel'
import SolarCloud from './SolarCloud'
import PowerCount from './PowerCount'
import { formatDate } from '@/util/common'
import { listDeviceParam } from '@/api/iot/iotDeviceParamApi'
import { listSensorWith } from '@/api/iot/iotDeviceSensorApi'

export default {
  name: 'Solar',
  components: {
    Calculation,
    SolarBattery,
    SolarPanel,
    SolarCloud,
    PowerCount
  },
  props: {
    device: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      calcutionDialogVisible: false,
      batteryList: [{
        batterySurplus: null,
        batteryTemplate: null,
        batteryCharging: null,
        batteryType: null,
        chargingVoltage: null,
        batteryVoltage: null,
        chargingCurrent: null,
        outputCurrent: null,
        highProtectTemplate: null,
        lowProtectTemplate: null,
        panelDayPowerCount: null,
        panelPowerCount: null,
        mpptVersion: null,
        softVersion: null,
        hardVersion: null,
        pcbTemplate: null,
        batteryCapacity: null
      }],
      batteryCapacity: null,
      panelPower: null,
      otherList: [],
      paramList: [],
      sensorList: []
    }
  },
  watch: {
    device: {
      deep: true,
      handler() {
        this.init()
      }
    }
  },
  created() {
    this.init()
  },
  methods: {
    init() {
      this.batteryCapacity = null
      this.panelPower = null
      this.otherList = []
      this.paramList = []
      this.sensorList = []
      this.listDeviceParam()
    },
    formatDate(date) {
      return formatDate(this, date)
    },
    listDeviceParam() {
      listDeviceParam({
        deviceCore: this.device.deviceCore
      }).then(res => {
        const { data, code } = res
        if (code === '200') {
          this.paramList = data
          for (let i = 0, j = data.length; i < j; i++) {
            if (data[i].keyName === 'battery_capacity') {
              this.batteryCapacity = data[i].value
            } else if (data[i].keyName === 'panel_power') {
              this.panelPower = data[i].value
            }
          }
        }
        this.listSensorWith()
      })
    },
    listSensorWith() {
      listSensorWith({
        deviceCore: this.device.deviceCore,
        withExplain: true
      }).then(res => {
        const { code, data } = res
        if (code === '200') {
          this.sensorList = data
          this.initSensor()
        }
      })
    },
    initSensor() {
      if (this.sensorList.length === 0) {
        return
      }
      const batteryList = [{
        batteryCharging: this.device.charging,
        batterySurplus: this.device.surplus,
        panelPower: this.panelPower,
        batteryCapacity: this.batteryCapacity
      }]
      const otherList = []
      for (const sensor of this.sensorList) {
        for (const explain of sensor.explainList) {
          /**
             * PCB板温度
             */
          if (explain.keyName === 'T_inside') {
            batteryList[0].pcbTemplate = explain.value
          } else if (explain.keyName === 'T_inside_10') {
            batteryList[0].pcbTemplate = explain.value
          } else if (explain.keyName === 'T_inside_20') {
            if (batteryList.length < 2) {
              for (let i = 0, j = 2 - batteryList.length; i < j; i++) {
                batteryList.push({})
              }
            }
            batteryList[1].pcbTemplate = explain.value
          } else if (explain.keyName === 'V_bat' || explain.keyName === 'V_battery_10' || explain.keyName === 'V_battery_20') {
            /**
               * 电池电压
               */
            let powerPercent = this.device.surplus
            const surplus = parseInt(explain.value)
            if (surplus >= 12600) {
              powerPercent = 100
            } else if (surplus > 9600) {
              powerPercent = (surplus - 9600) / 30
            }
            if (powerPercent <= 0) {
              powerPercent = 1
            } else if (powerPercent > 100 && powerPercent < 1000) {
              powerPercent = 100
            }

            if (explain.keyName === 'V_bat') {
              batteryList[0].batteryVoltage = explain.value
              batteryList[0].batterySurplus = powerPercent
            } else if (explain.keyName === 'V_battery_10') {
              batteryList[0].batteryVoltage = explain.value
              batteryList[0].batterySurplus = powerPercent
            } else if (explain.keyName === 'V_battery_20') {
              if (batteryList.length < 2) {
                for (let i = 0, j = 2 - batteryList.length; i < j; i++) {
                  batteryList.push({})
                }
              }
              batteryList[1].batteryVoltage = explain.value
              batteryList[1].batterySurplus = powerPercent
            }
            batteryList[0].batterySurplus = this.device.surplus
          } else if (explain.keyName === 'V_power') {
            /**
               * 充电电压
               */
            batteryList[0].chargingVoltage = explain.value
          } else if (explain.keyName === 'V_power_10') {
            batteryList[0].chargingVoltage = explain.value
          } else if (explain.keyName === 'V_power_20') {
            if (batteryList.length < 2) {
              for (let i = 0, j = 2 - batteryList.length; i < j; i++) {
                batteryList.push({})
              }
            }
            batteryList[1].chargingVoltage = explain.value
          } else if (explain.keyName === 'b_type') {
            /**
               * 电池类型
               */
            batteryList[0].batteryType = explain.value
          } else if (explain.keyName === 'day_energy') {
            /**
               * 每日发电量
               */
            batteryList[0].panelDayPowerCount = explain.value
          } else if (explain.keyName === 'd_type') {
            /**
               * mppt类型
               */
            batteryList[0].mpptVersion = explain.value
          } else if (explain.keyName === 'I_charge' || explain.keyName === 'I_charge_10' || explain.keyName === 'I_charge_20') {
            /**
               * 充电电流
               */
            const chargeI = parseInt(explain.value)
            let batteryCharging
            if (chargeI > 50) {
              batteryCharging = true
            } else {
              batteryCharging = false
            }
            if (explain.keyName === 'I_charge') {
              batteryList[0].chargingCurrent = explain.value
              batteryList[0].batteryCharging = batteryCharging
            } else if (explain.keyName === 'I_charge_10') {
              batteryList[0].chargingCurrent = explain.value
              batteryList[0].batteryCharging = batteryCharging
            } else if (explain.keyName === 'I_charge_20') {
              if (batteryList.length < 2) {
                for (let i = 0, j = 2 - batteryList.length; i < j; i++) {
                  batteryList.push({})
                }
              }

              batteryList[1].chargingCurrent = explain.value
              batteryList[1].batteryCharging = batteryCharging
            }
          } else if (explain.keyName === 'I_output') {
            /**
               * 负载电流
               */
            batteryList[0].outputCurrent = explain.value
          } else if (explain.keyName === 'I_output_10') {
            batteryList[0].outputCurrent = explain.value
          } else if (explain.keyName === 'I_output_20') {
            if (batteryList.length < 2) {
              for (let i = 0, j = 2 - batteryList.length; i < j; i++) {
                batteryList.push({})
              }
            }
            batteryList[1].outputCurrent = explain.value
          } else if (explain.keyName === 'low_temp') {
            /**
               * 低温保护温度
               */
            batteryList[0].lowProtectTemplate = explain.value
          } else if (explain.keyName === 'MPPT_version') {
            /**
               * 软件版本
               */
            batteryList[0].softVersion = explain.value
          } else if (explain.keyName === 'sum_energy') {
            /**
               * 发电总电量
               */
            batteryList[0].panelPowerCount = explain.value
          } else if (explain.keyName === 'Surplus') {
            /**
               * 电量
               */
            batteryList[0].batterySurplus = parseInt(explain.value)
          }
          // else if (explain.keyName === 'Surplus') {
          //   /**
          //    * 电池容量
          //    */
          //   batteryList[0].batteryCapacity = parseInt(explain.value)
          // }
          else if (explain.keyName === 'top_temp') {
            /**
               * 高温保护温度
               */
            batteryList[0].highProtectTemplate = explain.value
          } else if (explain.keyName === 'T_bat') {
            /**
               * 电池环境温度
               */
            batteryList[0].batteryTemplate = explain.value
          } else if (explain.keyName === 'T_battery_10') {
            batteryList[0].batteryTemplate = explain.value
          } else if (explain.keyName === 'T_battery_20') {
            if (batteryList.length < 2) {
              for (let i = 0, j = 2 - batteryList.length; i < j; i++) {
                batteryList.push({})
              }
            }
            batteryList[1].batteryTemplate = explain.value
          } else {
            otherList.push({
              ...explain
            })
          }
        }
      }
      this.batteryList = batteryList
      this.otherList = otherList
    }
  }
}
</script>
<style scoped>
  .info-item {
    margin-top: 13px;
    font-size: 7px;
  }

  .title {
    color: #909399;
  }

  .value {
    margin-left: 13px;
    color: #34bfa3;
  }

  .sunny {
    position: absolute;
    font-size: 50px;
    animation: sunny-animate 5s infinite;
  }

  @keyframes sunny-animate {
    0% {
      right: 13px;
      top: 0;
      transform: scale(1.5);
    }

    50% {
      right: 50%;
      top: 13px;
    }

    100% {
      right: 50%;
      top: 50px;
      transform: scale(0.5);
    }
  }

</style>

